<template>
  <el-select
    clearable
    filterable
    multiple
    v-model="brandId"
    placeholder="车辆品牌"
    @change="brandIdChange"
  >
    <el-option
      v-for="item in allBrand"
      :key="item.id"
      :value="item.id"
      :label="item.name"
    />
  </el-select>
</template>
<script>
import { getAllBrand } from '@/api/after-sale/systemManage/carModel'
export default {
  model: {
    props: 'value',
    event: 'input',
  },
  props: {
    value: {
      default: '',
    },
  },
  data() {
    return {
      allBrand: [], //所有车辆品牌集合
      brandId: [], //多选数组
    }
  },
  watch: {
    value: function (newValue, oldValue) {
      this.brandId = this.formtValue(newValue)
      this.$emit('input', newValue)
    },
  },
  methods: {
    formtValue(value){
      let _arry=[];
      if(value.length>0){
        for (let index = 0; index < value.length; index++) {
          const element = value[index];
          _arry.push(Number(element))
        }
      }
      return _arry;
    },
    brandIdChange(value) {
      this.$emit('input', value)
    },
  },
  async created() {
    await getAllBrand().then((res) => {
      let { success, data } = res
      if (success) this.allBrand = data
    })
  },
  mounted() {
    this.brandId = this.formtValue(this.value);
  },
}
</script>
